<template>
  <x-page title="搜索">
    <card :header="{title: '热门搜索'}">
      <div slot="content" class="keys_box">
        <x-button plain mini type="primary" is-link class="custom-primary-red" :link="special.url">{{special.key}}</x-button>
        <x-button plain mini type="primary" class="mr-sm" v-for="(item, index) in hotkey" :key="index">{{item.k}}</x-button>
      </div>
    </card>
  </x-page>
</template>

<script>
import { Search, Card, XButton, AjaxPlugin } from 'vux'
export default {
  name: 'search',
  components: {
    Search,
    Card,
    XButton
  },
  data () {
    return {
      keyWord: '',
      special: {},
      hotkey: [],
      params: {
        g_tk: 1928093487,
        uin: 0,
        loginUin: 411985844,
        hostUin: 0,
        format: 'json',
        inCharset: 'utf8',
        outCharset: 'utf-8',
        notice: 0,
        platform: 'yqq',
        needNewCode: 0
      }
    }
  },
  methods: {
    queryHotSearch(){
      let url = this.HOST + '/splcloud/fcgi-bin/gethotkey.fcg'
      AjaxPlugin.$http.get(url, {params: this.params}).then(res => {
        console.log(res)
        if (res && res.status === 200 && res.data) {
          let response = res.data.data
          this.special = {
            key: response.special_key,
            url: response.special_url
          }
          this.hotkey = response.hotkey
          console.log(response)
        }
      }).catch(e => {
        console.log(e)
      })
    }
  },
  created(){
    this.queryHotSearch()
  }
}
</script>
